<template>
  <div>
    <fieldset disabled="disabled">
      <el-form label-position="right" label-width="6em">
        <el-form-item label="订单时间">{{ info.time }}</el-form-item>
        <el-form-item label="订单总额">{{ sum | price }}</el-form-item>
        <el-form-item label="收货人地址">{{ info.addr }}</el-form-item>
        <el-form-item label="收货人姓名">{{ info.name }}</el-form-item>
        <el-form-item label="联系电话">{{ info.tel }}</el-form-item>
      </el-form>
      <el-table :data="cartlst">

        <el-table-column label="书名" prop="name"></el-table-column>
        <el-table-column label="作者" prop="author"></el-table-column>
        <el-table-column label="出版社" prop="house"></el-table-column>
        <el-table-column label="售价" prop="sellPrice">
          <template slot-scope="scope">
            {{ scope.row.sellPrice | price }}
          </template>
        </el-table-column>

        <el-table-column label="数量" prop="cnt"></el-table-column>

      </el-table>
    </fieldset>
  </div>
</template>

<script>
import { int2price } from '@/utils/format'

export default {
  name: 'order-item',
  props: {
    info: {
      required: true
    },
    cartlst: {
      required: true
    }
  },
  filters: {
    price (value) {
      return int2price(value, true)
    }
  },
  computed: {
    sum () {
      let sum = 0
      for (let item of this.cartlst) {
        sum += item.cnt * item.sellPrice
      }
      return sum
    }
  }
}
</script>

<style lang="scss" scoped>
.el-form-item {
  margin: 0;
}
.submitbtn {
  float: right;
}
</style>
